<style>
table.dataTable.no-footer {
    border-bottom: none;
    background: #fff;
}

/* #rebateDetail_wrapper{
	margin-top: 9em;
} */

table.dataTable thead th, table.dataTable thead td {
    text-align: center;
   /*  border: none; */
    outline: none;
    font-size: 0.9em;
    padding: 0.5em;
    font-weight: normal;
}

table.dataTable tbody tr td{
	text-align: center;
	font-size: 0.9em;
}

 .dataTables_info{
	display: none;
}

.dataTables_length{
	display: none;
} 

.dataTables_wrapper .tableSearch {
	 margin: 0 auto;
}

 .dataTables_empty{
	background: #fff;
    border: none !important;
} 

.dataTables_wrapper .tableSearch {
    margin: 2em auto;
    width: 100%;
    position: fixed;
    /* text-align: center; */
}

.dataTables_paginate{
	margin: 1em auto;
}

.date em {
    width: 16%;
    display: inline-block;
    color: #fff;
    margin-left: .5em;
    border: 1px solid #ecec71;
    padding: .2em;
    border-radius: .2em;
    cursor: pointer;
}	

</style>
<div class="wapper" id="subsidiary">
	<div class="col-xs-12 col-sm-4 col-sm-offset-4 text-center" style="color:white;background: #059BF3;height: 50px;line-height:50px;position: fixed;margin-top: 0px;left: 0px;z-index: 100;padding-left:0;padding-right:0;">
		<a  class="glyphicon glyphicon-chevron-left fl" onclick="backPage()" style="cursor:pointer; color: white;position:absolute;top:50%;transform:translateY(-50%);font-size: 20px;left:10px;"></a>
		<span style="font-size: 16px;">返佣明细</span>
	</div>
	<div data-v-3db6d6f6="" class="col-xs-12 col-sm-4 col-sm-offset-4 main child-view" s="[object Object]">
		<div data-v-3db6d6f6="" class="rb-top">
			<div data-v-3db6d6f6="" class="date"><input data-v-3db6d6f6="" id="date1" type="date" placeholder="输入开始日期"><span data-v-3db6d6f6=""> - </span><input data-v-3db6d6f6="" id="date2" placeholder="输入开始日期" type="date"><em>搜索</em></div>
			<div data-v-3db6d6f6="" class="detail">
				<p data-v-3db6d6f6="">日期区间返佣收益 (元)</p><span data-v-3db6d6f6="">0.00</span></div>
		</div>
		<div data-v-3db6d6f6="" class="rb-list">
			<table class="class-tableDataTable class-table-needClick display table table-striped table-bordered table-hover" id="rebateDetail">
				<thead>
					<tr>
						<th>会员名称</th>
						<th>消费金额</th>
						<th>返点类型</th>
						<th>代理返点率</th>
						<th>代理返点金额</th>
						<th>创建时间</th>
					</tr>
				</thead>
				<tbody></tbody>
			</table>
			<!-- <div data-v-3db6d6f6="" class="tip">暂无记录</div> -->
		</div>
	</div>
</div>
<script>
$(".foot").hide();
var s1 = GetDateStr(10);
var s2=GetDateStr(0);
$("#date1").val(s1);
$("#date2").val(s2);
function dataTable01(){
	var oTable=	$("#rebateDetail").DataTable({
			 "bProcessing" : false, 
			"bServerSide" : true,
			 "bPaginate" : true, 
			"sAjaxSource" : "/agent/findAgentTeamRebate.do",
			"fnServerData" : retrieveData, 
			"destroy":true,
		       "bLengthChange": true,      
		      "bSort": false,
		      "bAutoWidth": false,
		      'aLengthMenu':[5,10,20], 
		       "searching": false,  
		       "pageLength":5,
		       "pagingType": "full",
		       "dom": "t<'tableinfo'i<'tableSearch'p>l>",  
		       "language": {
		            "lengthMenu": "每页显示 _MENU_ 条记录",     
		             "zeroRecords": "没有检索到数据",     
		            "sInfo": "当前显示 _START_ 到 _END_ 条，共 _TOTAL_ 条记录",     
		            "info": "没有数据",     
		            "oPaginate": {     
		                "sFirst": "首页",     
		                "sPrevious": "前一页",     
		                "sNext": "后一页",     
		                "sLast": "尾页"    
		          	},
		            "search":"",
		            "searchPlaceholder": "请输入关键字",
		            "infoFiltered":   "(从  _MAX_ 记录中搜索出结果)",
		            "infoEmpty":      "没有找到匹配的信息",
		         },  
		         "columnDefs": [{"defaultContent": "",
                      "targets": "_all"}],
		         "columns": [
		        	 { "data": "user_name", "className": "user_name-td" },
					 { "data": "consume", "className": "consume-td" },	
                     { "data": "rebate_type", "className": "rebate_type-td" },
                     { "data": "rebate_ratio", "className": "rebate_ratio-td"   },
                     { "data": "rebate_money", "className": "rebate_money-td"  },
                     { "data": "created_time","className": "created_time-td" },
                 ],	
		});
	function retrieveData(sSource, aoData, fnCallback) {
		$.ajax({
			url : sSource,
			data : {
				"pageCount":aoData[0].value,
				"startIndex":aoData[3].value,
				"lineCount":aoData[4].value,
				"type":0,
				"startTime":s1,
				"endTime":s2,
			},
			type : 'post',
			dataType : 'json',
			async : false,
			success : function(result) { 
				var newJson = result.aaData;
				console.log(newJson);
				$('.detail span').text(result.data[0].rebate_ratio);
				if(newJson==""){
					$("#rebateDetail").css("border","none");
					$(".tableinfo").hide();
				}else{
					$("#rebateDetail").css("border","1px solid #ddd");
					$("#rebateDetail").css("border-bottom","none");
					$(".tableinfo").show();
				}	
        		 for (var i = 0; i < newJson.length; i++) {
         			 var item = newJson[i];
         			 if(item.rebate_type==2){
         				item.rebate_typ="打码";
         			 }
         			 item.consume=item.consume+"元";
         			 item.rebate_money=item.rebate_money+"元";
         			item.rebate_ratio=Number(item.rebate_ratio)*100+"%";
        		 }
        		 result.aaData=newJson;
				fnCallback(result);
			},
			error : function(msg) {
			}
		});
	};
}
dataTable01();

$(".date em").on("click",function(){
	s1=$("#date1").val();
	s2=$("#date2").val();
	dataTable01();
});

</script>